<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->

<!-- Bootstrap -->
<!-- TODO 考虑删除这个引用 -->
<link href="<%=request.getContextPath() %>/static/css/jumbotron.css" rel="stylesheet">
<link href="<%=request.getContextPath() %>/static/css/question.css" rel="stylesheet">
<script src="<%=request.getContextPath() %>/static/js/jquery.min.js"></script>
<script src="<%=request.getContextPath() %>/static/js/bootstrap.min.js"></script>

<link rel="stylesheet" href="<%=request.getContextPath()%>/static/css/font-awesome.min.css">
<link rel="stylesheet" href="<%=request.getContextPath()%>/static/css/bootstrap.min.css">
<link rel="stylesheet" href="<%=request.getContextPath()%>/static/css/navheader.css">

<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
  <script src="<%=request.getContextPath() %>/static/js/html5shiv.min.js"></script>
  <script src="<%=request.getContextPath() %>/static/js/respond.min.js"></script>
<![endif]-->
<title>全部问题</title>

<style type="text/css">

</style>

</head>
<body>

<jsp:include page="../Common/navHeader.jsp"></jsp:include>

<div class="row questionsheader">
	<div class="row" id="questionsarea">
		<div class="col-xs-4"></div>
		<div class="col-xs-4">
			<div class="row" id="questionsheader-img">
				Come on baby!
			</div>
			<div class="row questionsheader-name">
				#${item.topicname}考研#
			</div>
			<div class="row questionsheader-detail">
				问答:${item.questions.size() }10&nbsp;&nbsp;关注：0
			</div>
			<div class="row questionsheader-option">
				<button class="btn btn-default btn-sm">
					<span class="glyphicon glyphicon-plus"></span>
					关注
				</button>
			</div>
		</div>
		<div class="col-xs-4"></div>
	</div>
</div>


<div class="row">
	<div class="col-xs-1"></div>
	<div class="col-xs-10">
		<div class="row">
			<div class="col-xs-8">
				<div class="row li-menu">
					<ul class="nav nav-tabs" role="tablist">
					  <li role="presentation"><a href="#">全部</a></li>
					  <li role="presentation"><a href="#">视频</a></li>
					  <li role="presentation"><a href="#">精华</a></li>
					  <li role="presentation"><a href="#">文章</a></li>
					</ul>
				</div>
				
				<c:forEach begin="0" end="5">
					<div class="row questions">
						<div class="row questionstitle">
							<a href="<%=request.getContextPath() %>/Question/ViewQuestion?qid=1">研究生和本科生真的存在很大差别吗？</a>
						</div>
						<div class="row questionstime">
							1个回答-提问时间：2016年12月11日
						</div>
						<div class="row questionscontent">
							减少导航条内所有元素所占据的宽度。
							在某些尺寸的屏幕上（利用 响应式工具类）隐藏导航条内的一些元素。
							修改导航条在水平排列和折叠排列互相转化时，触发这个转化的最小屏幕宽度值。
							可以通过修改 @grid-float-breakpoint 变量实现，或者自己重写相关的媒体查
							询代码，覆盖 Bootstrap 的默认值。		
						</div>
						<div class="row questionsicons">
							<a><span class="glyphicon glyphicon-comment">评论${subitem.comments.size() } </span></a>&nbsp;&nbsp;
							<a><span class="glyphicon glyphicon-thumbs-up">支持</span></a>&nbsp;&nbsp;
							<a><span class="glyphicon glyphicon-star">收藏</span></a>&nbsp;&nbsp;
						</div>
						<div class="row questionsline">
							<hr/> 
						</div>
					</div>
				</c:forEach>
				
			</div>
			<div class="col-xs-4">
				<div class="row">
					<div class="col-xs-10">
					
						<div class="row topicabout">
							<div class="col-xs-6 about">话题介绍</div>
							<div class="col-xs-6 more">
								<a>查看全部<span class="glyphicon glyphicon-chevron-right"></span></a>
							</div>
						</div>
						
						<div class="row topiccontent">
							每年的毕业季都是刚毕业的大学生最困惑的时候，
							站在 人生的十字路口，选择考研还是工作，一直
							困扰着大学 生以及初入职场的年轻人。考研还是
							就业？在这里，找 到你想要的答案。
						</div>
						
						<div class="row topicabout">
							<div class="col-xs-6 about">相关话题</div>
							<div class="col-xs-6 more">
							</div>
						</div>
						
						<div class="row topiclist">
							<a>求职</a>
							<a>面试</a>
							<a>职业选择</a>
							<a>管培生</a>
							<a>职业选择</a>
							<a>求职</a>
							<a>求职</a>
							<a>求职</a>
							<a>求职</a>
							<a>求职</a>
							<a>求职</a>
						</div>
						
						<div class="row topicabout">
							<div class="col-xs-6 about">问答行家</div>
							<div class="col-xs-6 more">
								<a>查看全部<span class="glyphicon glyphicon-chevron-right"></span></a>
							</div>
						</div>
						
						<div class="row expert">
							<div class="col-xs-2">
								<span class="glyphicon glyphicon-user" aria-hidden="true"></span>					
							</div>
							<div class="col-xs-10">
								<div class="row">Michael</div>
								<div class="row description">高级人力资源专家，20年的企业管理经验</div>
							</div>
						</div>
						
						<div class="row expert">
							<div class="col-xs-2">
								<span class="glyphicon glyphicon-user" aria-hidden="true"></span>					
							</div>
							<div class="col-xs-10">
								<div class="row">李军</div>
								<div class="row description">高级人力资源专家，20年的企业管理经验</div>
							</div>
						</div>
						
						<div class="row topicabout">
							<div class="col-xs-6 about">相关课程</div>
							<div class="col-xs-6 more">
								<a>查看全部<span class="glyphicon glyphicon-chevron-right"></span></a>
							</div>
						</div>
						
						<div class="row course">
							<div class="row course-img"></div>
							<div class="row course-description"></div>
							<div class="row course-teacher">
								<span class="glyphicon glyphicon-user"></span>
								<div class="course-teacher-detail"></div>								
							</div>
						</div>
						
						<div class="row course">
							<div class="row course-img"></div>
							<div class="row course-description"></div>
							<div class="row course-teacher">
								<span class="glyphicon glyphicon-user"></span>
								<div class="course-teacher-detail"></div>								
							</div>
						</div>
					</div>
					
					<div class="col-xs-2"></div>
					
				</div>
			</div>
		</div>
	</div>
	<div class="col-xs-1"></div>

</div>
</body>
</html>